<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta content="IE=edge" http-equiv="X-UA-Compatible">
    <meta content="width=device-width, initial-scale=1.0" name="viewport">
    <title>文章添加</title>
    <!-- 引入 layui.css -->
    <link href="../../static/layui/css/layui.css" rel="stylesheet">
    <!--引入jquery.js -->
    <script src="https://cdn.jsdelivr.net/npm/jquery@3.2.1/dist/jquery.min.js"></script>
    <!-- 引入 layui.js -->
    <script src="../../static/layui/js/layui.js"></script>

    <link rel="stylesheet" href="../../static/lib/editormd/css/editormd.css">
    <script src="../../static/lib/editormd/editormd.js"></script>
</head>
<body>
<div class="layui-layout layui-layout-admin">

    <div class="layui-header layui-anim layui-anim-down">
        <div class="layui-logo layui-hide-xs layui-bg-black">Blog后台管理</div>
        <!-- 头部区域（可配合layui 已有的水平导航） -->
        <ul class="layui-nav layui-layout-left">
            <!-- 移动端显示 -->
            <li class="layui-nav-item layui-show-xs-inline-block layui-hide-sm" lay-header-event="menuLeft">
                <i class="layui-icon layui-icon-spread-left"></i>
            </li>
<!--            <li class="layui-nav-item layui-hide-xs"><a href="">选项1</a></li>-->
<!--            <li class="layui-nav-item layui-hide-xs"><a href="">选项2</a></li>-->
<!--            <li class="layui-nav-item layui-hide-xs"><a href="">选项3</a></li>-->
<!--            <li class="layui-nav-item">-->
<!--                <a href="javascript:;">工具栏</a>-->
<!--                <dl class="layui-nav-child">-->
<!--                    <dd><a href="">工具1</a></dd>-->
<!--                    <dd><a href="">工具2</a></dd>-->
<!--                    <dd><a href="">工具3</a></dd>-->
<!--                </dl>-->
<!--            </li>-->
        </ul>
        <ul class="layui-nav layui-layout-right">
            <li class="layui-nav-item layui-hide layui-show-md-inline-block">
                <a href="javascript:;">
                    <img class="layui-nav-img" src="../../static/image/827f8a0a8178ab17f694e01243dd2ec.jpg">
                    倾心Yatoli
                </a>
                <dl class="layui-nav-child">
                    <dd><a href="">个人信息</a></dd>
                    <dd><a href="">设置</a></dd>
                    <dd><a href="">注销</a></dd>
                </dl>
            </li>
            <li class="layui-nav-item" lay-header-event="menuRight" lay-unselect>
                <a href="javascript:;">
                    <i class="layui-icon layui-icon-more-vertical"></i>
                </a>
            </li>
        </ul>
    </div>

    <div class="layui-side layui-bg-black layui-anim layui-anim-up">
        <div class="layui-side-scroll">
            <!-- 左侧导航区域（可配合layui已有的垂直导航） -->
            <ul class="layui-nav layui-nav-tree">
                <li class="layui-nav-item">
                    <a class="" href="javascript:;">系统管理</a>
                    <dl class="layui-nav-child">
                        <dd><a href="../function/list.html" href="javascript:;">功能列表</a></dd>
                        <dd><a href="../article/list.html" href="javascript:;">文章管理</a></dd>
                        <dd><a href="../article_required/list.html" href="javascript:;">类型管理</a></dd>
                        <dd><a href="../user/list.html" href="javascript:;">用户管理</a></dd>
                    </dl>
                </li>

                <li class="layui-nav-item layui-nav-itemed">
                    <a href="javascript:;">文章管理</a>
                    <dl class="layui-nav-child">
                        <dd><a href="../article/list.html" href="javascript:;">文章列表</a></dd>
                        <dd><a class="layui-this" href="" href="javascript:;">发布文章</a></dd>
                    </dl>
                </li>

<!--                <li class="layui-nav-item">-->
<!--                    <a href="javascript:;">类型管理</a>-->
<!--                    <dl class="layui-nav-child">-->
<!--                        <dd><a href="javascript:;">类型列表</a></dd>-->
<!--                    </dl>-->
<!--                </li>-->

<!--                <li class="layui-nav-item">-->
<!--                    <a href="javascript:;">用户管理</a>-->
<!--                    <dl class="layui-nav-child">-->
<!--                        <dd><a href="javascript:;">用户列表</a></dd>-->
<!--                    </dl>-->
<!--                </li>-->
            </ul>
        </div>
    </div>

    <div class="layui-body layui-anim layui-anim-up">
        <!-- 内容主体区域 -->
        <div style="padding: 15px;">
            <div class="layui-fluid">
                <div class="layui-row layui-nav">
                    <div class="layui-col-md12">
                        <ul class="layui-nav" >
                            <li class="layui-nav-item"><a href="../index.html">返回首页</a></li>
                            <li class="layui-nav-item"><a href="./list.html">文章列表</a></li>
                            <li class="layui-nav-item"><a class="layui-this" href="javascript:;">文章添加</a></li>
                        </ul>
                    </div>
                </div>

                <div class="layui-container">
                    <form action="" method="post">
                        <input type="hidden" name="articleUserId" value="1">
                        <div class="layui-row" style="margin-top:30px">
                            <div style="margin-bottom: 20px;">
                                <h2 style="margin-bottom: 20px;">标题</h2>
                                <input type="text" name="articleTitle" required lay-verify="required" autocomplete="off"  placeholder="请输入标题" class="layui-input">
                            </div>

<!--                            <div style="margin-bottom: 20px;">-->
<!--                                <h2 style="margin-bottom: 20px;">封面</h2>-->
<!--                                <div style="border:rgba(157,153,153,0.2) solid 1px">-->
<!--                                    <input  style="opacity: 0;" type="file" name="cover" required lay-verify="required" autocomplete="off" class="layui-input">-->
<!--                                </div>-->
<!--                            </div>-->

                            <div style="margin-bottom: 20px;">
                                <h2 style="margin-bottom: 20px;">博客内容</h2>
                                <div id="md-content">
                                    <textarea style="display:none;" name="articleContent" placeholder="请输入内容" class="layui-textarea"></textarea>
                                </div>
                            </div>

                            <div class="layui-row">
                                <div class="layui-col-md6" style="margin-bottom: 20px;">
                                    <h2 style="margin-bottom: 20px;">文章类别</h2>
                                    <select required lay-verify="required" autocomplete="off"  name="articleCategoryId" lay-verify="required" class="layui-input">
                                        <option value="" selected disabled>请选择一个类别</option>
                                        <option value="0">java</option>
                                        <option value="1">springboot</option>
                                        <option value="2">mybatis</option>
                                        <option value="3">layui</option>
                                        <option value="4">semantic</option>
                                    </select>
                                </div>

                                <div class="layui-col-md6" style="margin-bottom: 20px;">
                                    <h2 style="margin-bottom: 20px;">文章类型</h2>
                                    <select required lay-verify="required" autocomplete="off"  name="articleTypeId" lay-verify="required" class="layui-input">
                                        <option value="" selected disabled>请选择一个类型</option>
                                        <option value="0">原创</option>
                                        <option value="1">转载</option>
                                        <option value="2">翻译</option>
                                    </select>
                                </div>
                            </div>

                            <div style="margin-bottom: 20px;">
                                <button type="submit" class="layui-btn layui-btn-fluid">发布</button>
                            </div>
                        </div>
                    </form>
                </div>
            </div>
        </div>
    </div>
</div>
</body>
<script type="text/javascript">
    let contentEditor;
    $(function() {
        contentEditor = editormd("md-content", {
            placeholder : "欢迎使用倾心Yatoli的博客",
            width  : "100%",
            height : "640",
            path   : "../../static/lib/editormd/lib/",
            syncScrolling : "single",
            emoji : true,
            tocm : true, // Using [TOCM]
            tex : true, // 开启科学公式TeX语言支持，默认关闭
            flowChart : true, // 开启流程图支持，默认关闭
        });
    });
</script>
</html>